﻿@{
    var gridPageSize = EngineContext.Current.Resolve<SmartStore.Core.Domain.Common.AdminAreaSettings>().GridPageSize;
    ViewBag.Title = T("Admin.Configuration.Settings.AllSettings").Text;
}
@using Telerik.Web.Mvc.UI;
@using System.Linq;
<div class="section-header">
    <div class="title">
        <i class="fa fa-cogs"></i>
        @T("Admin.Configuration.Settings.AllSettings")
    </div>
</div>

<div class="alert alert-info">
    @T("Admin.Configuration.Settings.AllSettings.Description")
</div>

<div>
	@(Html.Telerik().Grid<SettingModel>()
		.Name("settings-grid")
		.DataKeys(x =>
		{
			x.Add(y => y.Id).RouteKey("Id");
		})
		.Columns(columns =>
		{
			columns.Bound(x => x.Name).Width("25%");
			columns.Bound(x => x.Value)
				.Width("55%")
				.HtmlAttributes(new { style = "max-width: 600px;" })
				.EditorTemplateName("MultilineText");
			columns.Bound(x => x.Store).EditorTemplateName("Store").Width("15%");
			columns.Command(commands =>
			{
				commands.Edit().Localize(T);
				commands.Delete().Localize(T);
			})
			.HtmlAttributes(new { align = "right" });
		})
		.ToolBar(x => x.Insert())
		.Editable(x =>
		{
			x.Mode(GridEditMode.InLine);
		})
		.Filterable()
		.Pageable(settings => settings.PageSize(gridPageSize).Position(GridPagerPosition.Both))
		.DataBinding(dataBinding =>
		{
			dataBinding.Ajax().Select("AllSettings", "Setting")
				.Update("SettingUpdate", "Setting")
				.Delete("SettingDelete", "Setting")
				.Insert("SettingAdd", "Setting");
		})
		.ClientEvents(x => x.OnError("grid_onError").OnEdit("grid_onStoreEdit"))
		.PreserveGridState()
		.EnableCustomBinding(true))
</div>

<script>
    function grid_onError(e) {
        alert(e.XMLHttpRequest.responseText);
        console.log(e.XMLHttpRequest.responseText);
        e.preventDefault();
    }

	function grid_onStoreEdit(e) {
		if (e.mode == "edit") {
			_.delay(function () {
				$('#Store')
					.data('select-selected-id', e.dataItem['StoreId'])
					.data('select-init-text', e.dataItem['Store'])
					.val(e.dataItem['StoreId'])
					.trigger('change');
			}, 0);
		}
    }
</script>
